<template>
  <div id="app">
    <!-- 将基本显示模板直接在App.vue里使用 -->
      <base-layout>
        <router-view/>
      </base-layout>
  </div>
</template>

<script>
import baseLayout from './components/layout/baseLayout'
export default {
  name:'App',
  components:{
    baseLayout
  }
}
</script>

<style>
  html,body{
    margin: 0;
    padding: 0;
    /* 	
      为元素设定的宽度和高度决定了元素的边框盒。
      就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。
      通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度 
    */
    box-sizing: border-box;
    height: 100%;
  }
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
    box-sizing: border-box;
    height: 100%;
    /*  */
    overflow-y: auto;
  }
</style>
